Sprite Bytes are small tutorials that address a single method to be used with sprites in Liberty BASIC.

Animation

Last month's Sprite Byte discussed the Absolute Minimum for sprites. The program demonstrated how to add a sprite to a graphicbox or graphics window, and how to cause it to be displayed at a given location. That simple method can come in quite handy, but sprites are usually animated.

An Example of Animation

Animation is movement, but that can mean many things. Look at this little sign that says, "Liberty BASIC." It appears to be flashing red, then blue:

That can be done with sprites! It requires a "sign" sprite in the red color and another in the blue color. The sprites, minus their masks look like this:

Loading the Bitmap Images

To create a cycling animation, we must load a separate bitmap for each image in the sprite. If we want a sprite that cycles through four versions of a smiley face, we need four images like this:

Each bitmap must be loaded into memory with a unique Liberty BASIC name, using the LOADBMP command.

    loadbmp "smiley1", "sprites\smiley1.bmp"
    loadbmp "smiley2", "sprites\smiley2.bmp"
    loadbmp "smiley3", "sprites\smiley3.bmp"
    loadbmp "smiley4", "sprites\smiley4.bmp"

Adding Sprites

All four of the images are added to the sprite when we issue an ADDSPRITE command.

    #wg "addsprite smiley smiley1 smiley2 smiley3 smiley4"

The code above adds a sprite called "smiley" to the graphics window. The sprite consists of four images, smiley1, smiley2, smiley3 and smiley4. See the article in issue #132 for more information on locating the sprite on the window. Don't forget that the sprite won't show until a DRAWSPRITES command is issued.

Automatic Cycling - Forward and Backward

If the code stops after adding the sprite and issuing the DRAWSPRITES command, the first sprite image is displayed each time a DRAWSPRITES command is issued. The other three images are not seen. We cause the sprite to rotate through its images with the CYCLESPRITE command.

    'make sprite cycle
    #wg "cyclesprite smiley 1"

The "1" included in the command tells Liberty BASIC to cycle the sprite starting with its first image, then each time a DRAWSPRITES command is issued, to use the next image. When the last image is reached, it goes back to the beginning and uses the first image again. It does this over and over. The code could also look like this:

    'make sprite cycle
    #wg "cyclesprite smiley -1"

The "-1" tells Liberty BASIC to cycle through the images backwards. It starts with the last image, then moves to the next-to-last image, and so on, until it gets to the first image. After it uses the first image, it starts with the last image again. It does this over and over.

Cycling Once

From the helpfile:

If you do not want the sprite cycling to continue indefinitely, you can use the code below to tell Liberty BASIC to cycle through the images just one time. It adds the optional "once" argument to the "cyclesprite" command:

    'make sprite cycle
    #wg "cyclesprite smiley 1 once"

To cycle backwards through the images just one time:

    'make sprite cycle
    #wg "cyclesprite smiley -1 once"

Causing the Animation to Run

We've mentioned that the display is only updated when a DRAWSPRITES command is issued. To create an animation, we must issue the DRAWSPRITES command over and over. We could do it in a loop, like this:

    for i = 1 to 1000
	    #wg "drawsprites"
    next

On fast computers, that animation would run much too fast. There are several ways to change the timing of the animation. One way is to use a TIMER.

Adding a Timer

The timer statement looks like this:

    timer ms, [branchLabel]

The first argument is the number of milliseconds for the timer interval. There are 1000 milliseconds in one second. If the number "1000" were used, the timer would fire once per second. If the number was "500", the timer would fire once each half second. 250 milliseconds is a quarter second, and so on. The branch label specified in the timer statement is accessed each time the timer fires an event. Here is the code from the demo program that activates the timer:

    'set up timer for cycling
    timer 500, [update]

The routine that is executed each time the TIMER fires an event simply updates the display, causing the animation to run.

[update]
    #wg "drawsprites"
    wait

This tutorial ends with a small demo that creates an animated smiley-face using the sprites that come packaged with Liberty BASIC. Feel free to play with this and make changes.

DEMO

'Run this program from the root LB directory
'so that it can find the sprite bitmaps.
nomainwin

    'this is the sprite bitmap
    loadbmp "smiley1", "sprites\smiley1.bmp"
    loadbmp "smiley2", "sprites\smiley2.bmp"
    loadbmp "smiley3", "sprites\smiley3.bmp"
    loadbmp "smiley4", "sprites\smiley4.bmp"

    WindowHeight = 300:WindowWidth = 400

    'sprites can only appear in a graphics window or graphicbox
    open "Cycling Sprite" for graphics_nf_nsb as #wg

    'trap the close event so the code can issue
    'the proper CLOSE and END commands
    #wg "trapclose [quit]"

    'add a sprite
    #wg "addsprite smiley smiley1 smiley2 smiley3 smiley4"

    'make sprite cycle
    #wg "cyclesprite smiley 1"

    'give a location to sprite:
    #wg "spritexy smiley 30 40"

    'cause images to show
    #wg "drawsprites"

    'set up timer for cycling
    timer 500, [update]

'wait for user input
wait

[update]
    'sprite image will change automatically because of cyclesprite
    'update screen
    #wg "drawsprites"
    wait

[quit]
    timer 0
    unloadbmp "smiley1"
    unloadbmp "smiley2"
    unloadbmp "smiley3"
    unloadbmp "smiley4"
    close #wg:end